<template>
  <div class="profile">
    <el-card>
      <template #header>
        <h3>个人信息</h3>
      </template>
      <el-descriptions :column="1" border>
        <el-descriptions-item label="用户名">
          {{ userStore.user?.username }}
        </el-descriptions-item>
        <el-descriptions-item label="姓名">
          {{ userStore.user?.first_name }}
        </el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { useUserStore } from '../stores/user'

const userStore = useUserStore()
</script>

<style scoped>
.profile {
  max-width: 800px;
  margin: 0 auto;
}
</style> 